<!DOCTYPE html>
<html lang="zh-cn">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  <meta http-equiv="X-UA-Compatible" content="IE=Edge;chrome=1" />
  <meta http-equiv="Cache-control" content="public">
  <link rel="stylesheet" href="css/reset.css" type="text/css" />
  <link rel="stylesheet" href="css/zoom.css" type="text/css" />
  <link rel="stylesheet" href="css/index.css" type="text/css" />
  <link rel="shortcut icon" href="img/favicon.ico">
  <title>导出记录</title>
</head>
<body>
  <div class="aside" style="left: 0;"></div>
  <div class="aside" style="right: 0;">
    <div class="timeline-container current-timeline relative" id="messageTimeline"></div>
    <div class="timeline-container relative" id="imageTimeline"></div>
    <div class="timeline-container relative" id="videoTimeline"></div>
  </div>
  <div class="main relative">

    <div class="title">
      <span id="name"></span>
      <div class="action-bar right">
        <a href="javascript:;" id="message" class="inline-block tab-item selected-item" title="全部消息"></a>
        <!-- a href="javascript:;" id="image" class="inline-block tab-item" title="看过的图片"></a>
        <a href="javascript:;" id="video" class="inline-block tab-item" title="看过的视频"></a -->
      </div>
    </div>

    <div class="message-container current-tab clearfix">
    </div>
    <div class="video-container clearfix">
    </div>
    <div class="image-container clearfix">
    </div>
  </div>
  <script type="text/template" id="myTemplate">
  [: var prevImage = ''; for(var i = 0, l = data.length; i < l; i++) { var item = data[i];:]
    [: if(WeChat.isImageMsg(item)) { :]
      <!-- /*图片消息*/ -->
      <div class="message-text-container clearfix" id="m_[:=item.m_uiMesLocalID:]">
        <img class="message-avatar left" src="[:=WeChat.getHeaderImage(item):]" alt="头像" />
        <div class="left">
          <img class="message-img" data-index="[:=item.imageIndex:]" data-action="zoom" onerror="javascript:this.src='img/wechat/pic_delete.png';this.style.cursor='default';" data-org="[:=item.m_nsContent:]" data-thumb="[:=item.m_nsThumbnail:]" data-w="[:=item.m_nsWidth:]" data-h="[:=item.m_nsHeight:]" src="[:=item.m_nsThumbnail:]" alt="" />
        </div>
      </div>
      [: prevImage = item.m_nsContent; :]
    [: } else if(WeChat.isTextMsg(item)) { :]
      <!-- /*文字消息*/ -->
      <div class="message-text-container clearfix" id="m_[:=item.m_uiMesLocalID:]">
        <img class="message-avatar left" src="[:=WeChat.getHeaderImage(item):]" alt="头像" />
        <div class="left">
          <span class="arrow-left left"></span>
          <div class="inline-block message-content-left">[:=item.m_nsContent:]</div>
        </div>
      </div>
    [: } else if(WeChat.isFileMsg(item)) { :]
      <!-- /*文件消息*/ -->
      <div class="message-text-container clearfix" id="m_[:=item.m_uiMesLocalID:]">
        <img class="message-avatar left" src="[:=WeChat.getHeaderImage(item):]" alt="头像" />
        <div class="left">
          [: if(item.m_nsFileExist) { :]
          <a class="file-message inline-block clearfix", href="[:=item.m_nsContent:]", target="_blank">
          [: } else { :]
          <div class="file-message inline-block clearfix">
          [: } :]
            <span class="file-img inline-block right file-[:=item.m_nsFormat:]"></span>
            <div class="file-name left">
              <h4>[:=item.m_nsTitle:]</h4>
              <p class="file-size">[:=(item.m_nsFileSize/1024/1024).toFixed(1):]MB</p>
            </div>
          [: if(item.m_nsFileExist) { :]
          </a>
          [: } else { :]
          </div>
          [: } :]
        </div>
      </div>
    [: } else if(WeChat.isShareLink(item)) { :]
      <!-- /*分享消息*/ -->
      <div class="message-text-container clearfix" id="m_[:=item.m_uiMesLocalID:]">
        <img class="message-avatar left" src="[:=WeChat.getHeaderImage(item):]" alt="头像" />
        <div class="left">
          <a class="message-link inline-block" href="[:=item.m_nsContent:]" target="_blank">
            <h4>[:=item.m_nsTitle:]</h4>
            <div class="message-link-description">
              <span class="message-link-icon right" style="[:=WeChat.getLinkThumbnail(item):]"></span>[:=item.m_nsDescription:]
            </div>
          </a>
        </div>
      </div>
    [: } else if(WeChat.isMiniProgram(item)) { :]
      <!-- /*小程序*/ -->
      <div class="message-text-container clearfix" id="m_[:=item.m_uiMesLocalID:]">
        <img class="message-avatar left" src="[:=WeChat.getHeaderImage(item):]" alt="头像" />
        <div class="left">
          <div class="message-link inline-block" target="_blank">
            <h4>[:=item.m_nsContent.msg && item.m_nsContent.msg.appmsg && item.m_nsContent.msg.appmsg.title:]</h4>
            <div class="message-link-description">
              <span class="message-sp-icon right"></span>
              [:=item.m_nsContent.msg && item.m_nsContent.msg.appmsg && item.m_nsContent.msg.appmsg.des:]<br/>
            </div>
            <div class="user-card-bottom">收到一个小程序，请在手机上查看</div>
          </div>
        </div>
      </div>
    [: } else if(WeChat.isVideoMsg(item)) { :]
      <!-- /*视频消息*/ -->
      <div class="message-text-container clearfix" id="m_[:=item.m_uiMesLocalID:]">
        <img class="message-avatar left" src="[:=WeChat.getHeaderImage(item):]" alt="头像" />
        <div class="left">
          <video width="100%" class="message-video" controls><source src="[:=item.m_nsContent:]" type="video/mp4"></video>
        </div>
      </div>
    [: } else if(WeChat.isVoiceMsg(item)) { :]
      <!-- /*语音消息*/ -->
      <div class="message-text-container clearfix" id="m_[:=item.m_uiMesLocalID:]">
        <img class="message-avatar left" src="[:=WeChat.getHeaderImage(item):]" alt="头像" />
        <div class="left relative">
          <span class="arrow-left left"></span>
          <div class="inline-block message-content-left">
            <audio src="[:=item.m_nsContent:]"></audio>
            <span class="inline-block voice-img voice-left-img" style="width:120px;"></span>
            <span class="voice-duration voice-duration-left">[:=item.m_uiVoiceTime:]''</span>
          </div>
        </div>
      </div>
    [: } else if(WeChat.isVideoChat(item)) { :]
      <!--视频聊天消息-->
      <div class="message-text-container clearfix" id="m_[:=item.m_uiMesLocalID:]">
        <img class="message-avatar left" src="[:=WeChat.getHeaderImage(item):]" alt="头像" />
        <div class="left">
          <span class="arrow-left left"></span>
          <div class="inline-block message-content-left share-location">[:=item.m_nsContent.msg && item.m_nsContent.msg.voipinvitemsg? '发起视频邀请' : (item.m_nsContent.msg && item.m_nsContent.msg.voiplocalinfo.duration == 0? '视频已取消' : '视频消息'):]</div>
        </div>
      </div>
    [: } else if(WeChat.isContactMsg(item)) { :]
      <!-- /*名片消息*/ -->
      <div class="message-text-container clearfix" id="m_[:=item.m_uiMesLocalID:]">
        <img class="message-avatar left" src="[:=WeChat.getHeaderImage(item):]" alt="头像" />
        <div class="left">
          <div class="user-card">
            <div class="user-card-title">
              <img class="user-card-img left" src="img/wechat/person.jpg" />
              <div class="user-card-text">
                <h4 class="text-nowrap">[:=item.m_nsContent.msg && item.m_nsContent.msg.nickname:]<br>
                  <span class="user-card-tip text-nowrap">[:=item.m_nsContent.msg && item.m_nsContent.msg.alias:]</span>
                </h4>
              </div>
            </div>
            <div class="user-card-bottom">个人名片</div>
          </div>
        </div>
      </div>
    [: } else if(item.m_uiMessageType === 'time') { :]
      <!-- /*时间消息*/ -->
      <div class="message-time text-center">[:=item.m_nsContent:]</div>
    [: } else if(WeChat.isLocationMsg(item)) { :]
      <!-- /*位置消息*/ -->
      <div class="message-text-container clearfix" id="m_[:=item.m_uiMesLocalID:]">
        <img class="message-avatar left" src="[:=WeChat.getHeaderImage(item):]" alt="头像" />
        <div class="left">
          <div class="message-location inline-block">
            <h4>[:=item.m_nsContent.msg && item.m_nsContent.msg.location && item.m_nsContent.msg.location.label:]</h4>
            <div class="message-link-description">
              <span class="message-location-icon right"></span>
              [:=item.m_nsContent.msg && item.m_nsContent.msg.location && item.m_nsContent.msg.location.x:] [:=item.m_nsContent.msg && item.m_nsContent.msg.location && item.m_nsContent.msg.location.y:]
            </div>
          </div>
        </div>
      </div>
    [: } else { :]
      <!-- /*其他消息*/ -->
      <div class="message-text-container clearfix" id="m_[:=item.m_uiMesLocalID:]">
        <img class="message-avatar left" src="[:=WeChat.getHeaderImage(item):]" alt="头像" />
        <div class="left">
          <span class="arrow-left left"></span>
          <div class="inline-block message-content-left">当前版本暂不支持查看此消息,请在手机上查看</div>
        </div>
      </div>
    [: } :]

  [: } :]
  </script>
  <script type="text/template" id="timelineTemplate">
  [: var timelineIndex = 0; for(var year in data) { var months = data[year]; :]
    <div class="timeline-year relative[:=timelineIndex === 0 ? ' current-timeline-year' : '':]">
      <h4>[:=year:]</h4>
      <ul>
        [: for(var i in months) { var month = months[i]; :]
        <li>
          <a href="#" pageIndex="[:=month.itemIndex:]" class="timeline-month relative[:=timelineIndex === 0 ? ' current-timeline-month' : '':]">[:=month.text:]月</a>
        </li>
        [:  timelineIndex++; } :]
      </ul>
    </div>
  [: } :]
  </script>
  <script type="text/template" id="videoTemplate">
  [: var lastMonth = -1, lastYear = 0; for(var i = 0, l = data.length; i < l; i++) { var item = data[i], time = new Date(item.m_uiCreateTime * 1000);:]
    [: if(WeChat.isVideoMsg(item)) { :]
    [: if(time.getMonth() != lastMonth || time.getFullYear() != lastYear) { lastMonth = time.getMonth(); lastYear = time.getFullYear(); :]
    <h3 class="video-title">[:=time.getFullYear():]年[:=time.getMonth() + 1:]月</h3>
    [: } :]
    <div class="video-item-container left relative" id="v_[:=item.m_uiMesLocalID:]">
      <div class="relative">
        <div class="place-holder" style="background-image: url(img/wechat/video_delete.png);"></div>
        <video width="100%" class="video-item" onerror="javascript:this.parentNode.removeChild(this.nextElementSibling); this.parentNode.removeChild(this);" src="[:=item.m_nsContent:]"></video>
        <div class="play-layer"></div>
      </div>
    </div>
    [: } :]
  [: } :]
  </script>
  <script type="text/template" id="imageTemplate">
  [: var prevImage = '', lastMonth = -1, lastYear = 0; for(var i = 0, l = data.length; i < l; i++) { var item = data[i], time = new Date(item.m_uiCreateTime * 1000);:]
    [: if(WeChat.isImageMsg(item)) { :]
    [: if(time.getMonth() != lastMonth || time.getFullYear() != lastYear) { lastMonth = time.getMonth(); lastYear = time.getFullYear(); :]
    <h3 class="video-title">[:=time.getFullYear():]年[:=time.getMonth() + 1:]月</h3>
    [: } :]
    <div class="image-item-container left" id="i_[:=item.m_uiMesLocalID:]">
      <div class="relative">
        <div class="place-holder" style="background-image: url([:=item.m_nsThumbnail:]), url('img/wechat/pic_delete.png'); background-size: cover;"></div>
        <img class="image-item" data-index="[:=item.imageIndex:]" data-action="zoom" onerror="javascript:this.src='img/wechat/pic_delete.png';" data-org="[:=item.m_nsContent:]" data-thumb="[:=item.m_nsThumbnail:]" data-w="[:=item.m_nsWidth:]" data-h="[:=item.m_nsHeight:]" src="[:=item.m_nsThumbnail:]"  alt="" />
      </div>
    </div>
    [: prevImage = item.m_nsContent; } :]
  [: } :]
  </script>
  <script src="js/jquery.js"></script>
  <script src="js/wechat_fav.js"></script>
  <script src="js/message_fav.js"></script>
  <script src="js/tppl.js"></script>
  <script src="js/index.js"></script>
  <script src="js/bootstrap.min.js"></script>
  <script src="js/zoom.js"></script>
  <script src="js/lazy_img.min.js"></script>
</body>
</html>
